/*   
Theme Name: Anugrah Fotocopy
Theme URI: http://www.eyesimple.us
Description: Template for Anugrah Fotocopy
Author: EYESIMPLE
Author URI: http://www.eyesimple.us
Version: -
*/

/* YUI 3.5.0 reset.css (http://developer.yahoo.com/yui/3/cssreset/) - http://cssreset.com */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

/* TYPOGRAPHY */
@font-face { font-family: 'bebas'; src: url('fonts/BEBAS___0.TTF') format('truetype') }
@font-face { font-family: 'museo100'; src: url('fonts/MUSEO100-REGULAR.OTF') format('opentype') }
@font-face { font-family: 'museo300'; src: url('fonts/MUSEO-300.OTF') format('opentype') }
@font-face { font-family: 'museo500'; src: url('fonts/MUSEO500-REGULAR.OTF') format('opentype') }

h1,h2{ font-family: 'bebas'; }
h1{ font-size: 60px; }
h2, h2 a{ font-size: 24px; color: #3b7fae; }
h3{ font-size: 18px; color: #737373; font-family: 'museo300'; }

/* LAYOUT */
html{ min-height: 100%; margin: 0px !important; height:100%; width:100%; }
body{ font-family: 'museo300'; background: url('images/pattern.png'); min-height:100%; width:100%; }
.wrapper{ padding: 20px 20px 20px 40px; margin: 0 auto; width: 1160px; }
a{ text-decoration: none; }
a:hover{ color: #2996D7; }
hr{ border: none; border-top: 1px solid #d7d7d7; }

.add-bar{ background: #2996d7; position: absolute; width: 10px; height: 40px; top: -1px; left: -11px; }
.fl{ float: left; }
.fr{ float: right; }
.clear{ clear: both; }
.shadow{ -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3); }
.vshadow{ -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4); }
.vshadow2{ -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.5); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.5); }
.vshadow3{ -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1); }
.vshadow4{ -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1); }

/* BUTTONS */
.navigation .nav a, .btn{ border: 1px solid #c3def1; -webkit-border-radius: 15px; border-radius: 15px; background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top,  #ffffff 0%, #f3f3f3 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f3f3f3)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top,  #ffffff 0%,#f3f3f3 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top,  #ffffff 0%,#f3f3f3 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top,  #ffffff 0%,#f3f3f3 100%); /* IE10+ */ background: linear-gradient(to bottom,  #ffffff 0%,#f3f3f3 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 ); /* IE6-9 */ padding: 5px; cursor: pointer; text-align: center; min-width: 60px; font-family: 'museo100'; color: #0a5081; font-size: 12px; }

/* NAVIGATION */
.navigation{ width: 230px; margin: 0 auto 70px; }
.navigation .btn{ float: left; margin-right: 10px; }
.navigation .btn a{ font-size: 12px; color: #0c619b; }

/* GRID */
.grid1, .grid2{ float: left; margin-top: 50px; }
.grid2{ width: 590px; margin-right: 20px; margin-left: 30px; }
.grid1{ //width: 220px; width: 280px; }

/* ICONS */
.icon-white{ -webkit-border-radius: 50%; border-radius: 50%; width: 10px; height: 10px; background-color: #fff; }
.icon{ width: 14px; height: 14px; background: url('images/icons.png') no-repeat; }
.icon.magnify{ background-position: 0px 0px; }

/* SLIDESHOW */
.slideshow{ margin-left: 30px; position: relative; width: 880px; height: 310px; background: #0c6099; -webkit-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.5); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.5); }
#banner{ position: absolute; }
#banner .slide{ position: absolute; width: 940px; height: 310px; }
#banner .pic-container{ margin-right: 20px; text-align: center; width: 590px; overflow: hidden; height: 310px; float: left; -webkit-border-radius: 4px 0px 4px 0px; border-radius: 4px 0px 4px 0px; background-position: center center; }
#banner .pic-container img{ max-width: 590px; -webkit-border-radius: 4px; border-radius: 4px; }
#banner .slide-info{ width: 250px; padding: 20px; height: 270px; float: left; }
#banner h1{ font-size: 48px; color: #fff; margin-top: 20px; margin-bottom: 10px; }
#banner .slide-info-content{ margin-bottom: 10px; position: relative; left: 20px; }
#banner .slide-info-content *{ color: #fff; font-size: 12px; font-family: 'museo500'; line-height: 20px; }
#banner .slide-info-content ul li{ list-style-type: disc; }
#banner .discount h2{ color: #fff; font-size: 30px; }
#banner .discount p{ color: #fff; font-size: 10px; font-family: 'museo500'; }
.slideshow .arrowButton{ display: none !important; }
.slideshow-prevbtn, .slideshow-nextbtn{ top: 187px; position: absolute; width: 40px; height: 80px; cursor: pointer; }
.slideshow-prevbtn{ background: url('images/assets/prev.png') no-repeat; left: -3px; }
.slideshow-nextbtn{ background: url('images/assets/next.png') no-repeat; right: -3px; }

/* HEADER */
.header{ height: 30px; position: relative; margin-bottom: 40px; }
.search input[type="text"]{ border: 1px solid #c3def1; -webkit-border-radius: 15px; border-radius: 15px; font-size: 12px; padding: 5px 10px 5px 30px; width: 110px; }
.search .icon{ position: absolute; top: 6px; right: 125px; border: none; background-color: none; cursor: pointer; }

/* SIDEBAR */
.sidebar{ float: left; width: 190px; position: relative; }
.sidebar .menu-main-menu-container{ margin-top: 30px; //border: 1px solid #c3def1; -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3); background: #fff; }
.sidebar #menu-main-menu li{ min-height: 1px; position: relative; border-left: 1px solid #c3def1; border-right: 1px solid #c3def1; border-bottom: 1px solid #e8ecf7; }
.sidebar #menu-main-menu li a{ font-size: 13px; display: block; padding: 10px 10px; color: #0c619b; font-family: 'museo300'; }
.sidebar #menu-main-menu li.current-menu-item, #menu-main-menu li:hover, .sidebar #menu-main-menu li.current-menu-parent, .sidebar #menu-main-menu li.current-post-ancestor{ border: 1px solid #0c619b; }
.sidebar #menu-main-menu li:nth-last-child(1) a, #menu-main-menu li.current-menu-item a, .sidebar #menu-main-menu li.current-menu-parent a, .sidebar #menu-main-menu li.current-post-ancestor a{ border: 1px solid transparent; }
.sidebar #menu-main-menu li.current-menu-item a, #menu-main-menu li:hover a, .sidebar #menu-main-menu li.current-menu-parent a, .sidebar #menu-main-menu li.current-post-ancestor a{ background: #0c619b; color: #fff; }
.sidebar #menu-main-menu li:nth-last-child(1), .sidebar #menu-main-menu li:nth-last-child(2), .sidebar #menu-main-menu li:nth-last-child(3){ background: #fff !important; border: none !important; border-bottom: 1px solid #c3def1 !important; }

.promo{ margin-top: 25px; text-align: center; }
.promo h1{ color: #0c619b; text-transform: uppercase; text-align: center; }
.promo p{ font-size: 13px; color: #3b7fae; line-height: 20px; text-align: center; }

.box .box-header{ padding: 5px; background-color: #0c619b; }

/* FOOTER */
.home .footer{ margin-top: 70px; }
.footer{ border-top: 1px solid #d7d7d7; padding: 20px 0px; }
.footer .counter{ float: left; width: 100%; }
.footer .wordpress-hit-counter{ background-color: #fff; border: 1px solid #c3def1; -webkit-border-radius: 2px; border-radius: 2px; float: left; height: 23px; }
.footer .wordpress-hit-counter img{ padding: 5px; border-right: 1px solid #e3e3e3; }
.footer .wordpress-hit-counter img:nth-last-child(1){ border-right: none; }

.footer .menu-main-menu-container{ float: left; margin-top: 10px; }
.footer .menu-main-menu-container .menu li{ float: left; border-right: 1px solid #0c619b; margin-right: 5px; padding-right: 5px; height: 12px; }
.footer .menu-main-menu-container .menu li:nth-last-child(1){ border-right: none; padding: 0px; margin: 0px; }
.footer .menu-main-menu-container .menu li a{ font-size: 10px; color: #0c619b; position: relative; top: -6px; }

.footer .copyright, .footer .copyright a{ font-size: 10px; color: #0c619b; padding-top: 10px; }

/* CONTENT */
.content{ margin-left: 210px; width: 940px; position: relative; }

.home hr{ margin-left: 30px; margin-right: 30px; }
.home .quote{ margin: 30px auto 40px; text-align: center; }
.grid h2{ margin-bottom: 25px; }
.grid p{ font-size: 14px; color: #737373; line-height: 20px; text-align: justify; }
.grid h3{ margin-bottom: 15px; }
.grid ul li{ color: #737373; font-size: 14px; margin-bottom: 5px; }
.grid ul li strong{ font-weight: bold; display: inline-block; width: 50px; margin-right: 20px; }

.maps{ background-color: rgba(12,97,155,0.2); padding: 10px; margin-bottom: 30px; }
.field{ margin-top: 20px; position: relative; }

.contact, .info{ margin-bottom: 70px; float: left; }
.contact{ margin-right: 80px; }
.contact input[type="text"],textarea{ width: 390px; border: 1px solid #c3def1; padding: 5px 10px; font-size: 13px; -webkit-border-radius: 2px; border-radius: 2px; }
.wpcf7-response-output{ font-size: 13px !important; border: none !important; position: absolute; bottom: 95px; left: 55px; width: 300px; }

.info{ margin-top: 50px; width: 310px; }

.fb_iframe_widget{ top: -5px; margin-right: 10px; }
.twitter-share-button{ width: 90px !important; }

.news-field{ border-bottom: 1px solid #d7d7d7; padding-bottom: 20px; margin-bottom: 30px; }
.news-field:nth-last-child(1){ border-bottom: none; padding-bottom: 0px; }

.news .date{ float: left; }
.news .date .bar{ float: left; width: 10px; height: 50px; background: #3b7fae; opacity: 0.2; }
.news .date .date-info{ float: left; width: 40px; height: 40px; padding: 5px; background: rgba(12,97,155,0.1); text-align: center; }
.news .date .date-info h2{ color: #b1cbdc; line-height: 25px; }
.news .date .date-info p{ font-size: 14px; font-family: 'museo500'; color: #b1cbdc; }
.news .news-header, .news .news-content{ margin-left: 70px; margin-top: 20px; }
.news .news-header{ //border-bottom: 1px solid #e1e1e1; padding-bottom: 10px; margin-bottom: 10px; }
.news .news-header span{ font-size: 12px; color: #959595; margin-top: 5px; }
.news .news-header .share{ margin-top: 10px; }
.news .news-content p{ font-size: 13px; color: #737373; line-height: 20px; }

.news-detail{ margin-bottom: 60px; }
.news-detail .news-content p{ margin-bottom: 20px; }

.filter{ margin-bottom: 30px; float: left; width: 100%; }
.filter li{ font-size: 13px; cursor: pointer; color: #0c619b; float: left; margin-right: 10px; -webkit-border-radius: 15px; border-radius: 15px; background: rgba(12,97,155,0.1); padding: 5px 10px; }
.filter li:hover, .filter li.active{ color: #fff; background: #0c619b; }

.tag-best{ background: #0c619b; z-index: 100; position: absolute; padding: 5px 10px; line-height: 11px; font-size: 11px !important; font-family: 'museo500'; color: #fff !important; top: 10px; right: 0px; width: 60px; height: 10px; }
.tag-best .bar{ background: #2996d7; position: absolute; top: 0px; right: -5px; width: 5px; height: 20px; }
.product-container{ float: left; width: 100%; margin-bottom: 70px; padding-bottom: 10px; }
.product-box{ float: left; position: relative; padding: 10px; background: #fff; border: 1px solid #c3def1; margin-right: 20px; text-align: center; height: 235px; width: 190px; margin-bottom: 20px; }
.product-box .product-pic{ width: 190px; height: 170px; overflow: hidden; border-bottom: 1px solid #e1e1e1; }
.product-box .product-pic img{ max-width: 190px; }
.product-box .product-info{ padding: 10px; }
.product-box .product-info h3{ color: #0c619b; font-family: 'museo500'; margin-bottom: 5px; }
.product-box .product-info p{ color: #737373; font-family: 'museo300'; font-size: 14px; }
.single hr, .products hr{ border-top: 1px solid #c3def1; height: 1px; border-bottom: 1px solid #c3def1; position: absolute; width: 100%; bottom: -7px; left: 0px; }

.single .news-header p{ font-size: 12px; color: #959595; margin-top: 5px; }
.single .product-content{ text-align: justify; width: 438px; float: left; margin-left: 20px; position: relative; }
.single .product-content ul{ margin-bottom: 10px; }
.single .product-content ul li{ margin-left: 15px; list-style-type: disc; }
.single .product-content h2{ font-size: 24px; }
.single .pic-container{ float: left; position: relative; width: 460px; min-height: 310px; overflow: hidden; background: #fff; border: 1px solid #c3def1; margin-right: 20px; text-align: center; }
.single .pic-container img{ max-width: 460px; }
.single .news-content{ text-align: justify; margin-top: 30px; }
.single .news-content *{ color: #737373; font-size: 13px; }
.single .navigation{ margin-top: 20px; }

.single-product .news-header{ border-bottom: 1px solid #e1e1e1; }
.single-product .news-header, .single-product .news-content{ margin-left: 0px; }
.single-product .share{ margin-bottom: 30px; }

.only-news .pic-container{ width: 220px; min-height: 150px; height: 150px; }
.only-news .news-content p:nth-child(2){ color: #737373; font-size: 18px; font-family: 'museo300'; line-height: 24px; }

.about .summary{ width: 100%; height: 334px; background: url('images/maps.png') no-repeat; text-align: center; background-position: 32px 0px; }
.about .summary h2{ color: #3b7fae; padding-top: 30px; font-family: 'museo500'; }
.about .summary h1{ color: #3b7fae; }
.about .summary p{ margin-top: 30px; width: 370px; margin: 0 auto; line-height: 20px; font-size: 18px; color: #3b7fae; font-family: 'museo500'; font-weight: bold; }

.about .who{ margin-bottom: 50px; width: 600px; padding-right: 20px; margin-right: 20px; border-right: 1px solid #d8d8d8; }
.about .who, .about .open-hours{ float: left; }
.about .who *, .about .open-hours *{ font-size: 14px; color: #737373; }
.about .who strong, .about .open-hours strong{ font-weight: bold; }
.about .who h2, .about .open-hours h2{ margin-bottom: 20px; font-size: 24px; color: #3B7FAE; }
.about .who p{ text-align: justify; line-height: 20px; font-size: 14px; color: #737373; }
.about .open-hours ul li{ margin-bottom: 5px; }
.about .open-hours ul li strong{ font-weight: bold; width: 170px; margin-right: 30px; display: inline-block; }

.order{ margin-bottom: 70px; margin-left: 70px; }
.order h2{ margin-bottom: 10px; }
.order p{ font-size: 14px; color: #737373; margin-bottom: 10px; }
.order ul li{ margin-bottom: 5px; font-size: 14px; color: #737373; }
.order ul li strong{ font-weight: bold; width: 100px; margin-right: 30px; display: inline-block; }

.order .sort{ text-indent: -5px; float: left; margin-left: -60px; line-height: 30px; position: relative; padding: 10px; width: 30px; height: 30px; background: rgba(12,97,155,0.1); text-align: center; font-size: 30px; color: #b1cbdc; font-family: 'bebas'; }
.order .sort .bar{ width: 10px; height: 50px; background: #2996d7; opacity: 0.2; position: absolute; top: 0px; left: -10px; }

h2.results{ border-bottom: 1px solid #d7d7d7; padding-bottom: 10px; margin-bottom: 20px; }
.entry{ padding-bottom: 20px; border-bottom: 1px solid #d7d7d7; margin-bottom: 20px; }
.entry:nth-last-child(3){ border: none; }
.entry span{ font-size: 12px; color: #959595; }
.entry p{ font-size: 13px; color: #737373; margin-top: 20px; }

#view_overlay{ top: 0px !important; left: 0px !important; width: 100%; height: 100%; }

/* TRACK */
.track .pic-container{ width: 625px; height: 310px; }
.track .pic-container img{ max-width: 625px; max-height: 310px; }
.track .product-content{ width: 270px; }
.track .product-content *{ font-size: 18px !important; }
.track .product-content h2{ font-size: 36px !important; }
.track .news-content{ margin-bottom: 15px; float: left; }
.track .product-box{ width: 120px; height: 150px; margin-right: 19px; }
.track #child{ margin-top: 20px; }
.track #child a:nth-child(4n) .product-box{ margin-right: 0px; }
.track .product-box h3{ font-size: 14px; }
.track .product-box p{ font-size: 11px; }
.track .product-box .product-pic{ width: 120px; height: 80px; background-size: 100% auto; }